<template>
	<view class="doctorIndex-wrap" v-if="doctorInfo">
		<view class="index-bg" style="height: 410rpx;"></view>
		<view class="doctorIndex-header" @click="gotoRouter('/pages-doctor/auth/auth?doctorType=1')">
			<image class="doctorIndex-header-img" :src="doctorInfo.picture" mode="aspectFill"></image>
			<view class="doctorIndex-header-info">
				<view class="doctor-name">{{ doctorInfo.doctorName }}</view>
				<view class="doctor-title">{{ doctorInfo.jobGradeName }}</view>
				<view class="doctor-hospital">{{ doctorInfo.hospName }}&nbsp;&nbsp;{{ doctorInfo.departmentName }}</view>
			</view>
			<view class="doctorIndex-header-auth">{{ checkStatusConfig[doctorInfo.checkStatus] }}</view>
		</view>

		<view class="doctorIndex-count">
			<view class="doctorIndex-count-item">
				<view class="doctorIndex-count-info">好评率</view>
				<view class="doctorIndex-count-num">{{ doctorInfo.goodRate ? doctorInfo.goodRate : 0 }}%</view>
			</view>
			<view class="vertical-divider"></view>
			<view class="doctorIndex-count-item">
				<view class="doctorIndex-count-info">服务次数</view>
				<view class="doctorIndex-count-num">{{ doctorInfo.advisoryNum }}</view>
			</view>
			<view class="vertical-divider"></view>
			<view class="doctorIndex-count-item" @click="gotoRouter('/pages-mall/myHealthCoins/myHealthCoins?busType=21')">
				<view class="doctorIndex-count-info">我的健康金</view>
				<view class="doctorIndex-count-num">{{ doctorInfo.disMoney ? doctorInfo.disMoney: '0.00' }}</view>
			</view>
			<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_bottom_right.png"></image>
		</view>

		<view class="doctorIndex-tab">
			<view class="order-total-tip" v-if="orderTotal>0">
					{{orderTotal}}
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-doctor/myInquiry/myInquiry')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_my_inquiry.png" class="doctorIndex-tab-pic"></image>
				<view>专家问诊</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-doctor/privateInquiry/privateInquiry')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_medicine_inquiry.png" class="doctorIndex-tab-pic"></image>
				<view>开药问诊</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-doctor/mypharmacy/mypharmacy')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_my_store.png" class="doctorIndex-tab-pic"></image>
				<view>我的药房</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-doctor/article/article')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_article_center.png" class="doctorIndex-tab-pic"></image>
				<view>文章中心</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="showOrHideQRCode()">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_doctor_invite.png" class="doctorIndex-tab-pic"></image>
				<view>邀请医生</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-agencies/inviteList/inviteList')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_my_invite.png" class="doctorIndex-tab-pic"></image>
				<view>邀请列表</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-doctor/followManage/followManage')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_visit_manage.png" class="doctorIndex-tab-pic"></image>
				<view>随访管理</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-doctor/doctorSignList/doctorSignList')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_my_sign.png" class="doctorIndex-tab-pic"></image>
				<view>我的签约</view>
			</view>
			<view class="doctorIndex-tab-outer" @click="gotoRouter('/pages-doctor/patient/list')">
				<image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/doctor/ic_my_invite.png" class="doctorIndex-tab-pic"></image>
				<view>患者列表</view>
			</view>
		</view>


		<view class="doctorIndex-order" v-if="orderCentterList.length > 0">
			<view class="doctorIndex-title" @click="gotoRouter('/pages-doctor/striveOrders/striveOrders')">
				<u-title value="抢单中心"></u-title>
				<view class="doctorIndex-title-right">
					<view>查看全部</view>
					<image src="http://k8s.vendingtech.vip/images/next_icon@2x.png"></image>
				</view>
			</view>

			<view class="doctorIndex-order-list">
				<view
					class="doctorIndex-order-item"
					v-for="(item, index) in orderCentterList"
					:key="index"
					@click="gotoRouter('/pages-doctor/striveOrders/striveOrders?index=' + index)"
				>
					<view class="doctorIndex-order-header">
						<image :src="item.avatar" class="doctorIndex-order-word1"></image>
						<text lines="1" class="doctorIndex-order-word2">{{ item.patientName }}</text>
						<text lines="1" decode="true" class="doctorIndex-order-word3">{{ rangeSex[item.sex].text }}&nbsp;&nbsp;{{ item.age }}岁</text>
						<view v-if="item.orderType == 1" class="doctorIndex-order-word4 doctorIndex-order-yellow">极速问诊</view>
						<view v-if="item.orderType == 2" class="doctorIndex-order-word4 doctorIndex-order-green">开药问诊</view>
						<view v-if="item.orderType == 0" class="doctorIndex-order-word4 .doctorIndex-order-blue">专家问诊</view>
						<text lines="1" decode="true" class="doctorIndex-order-word5">¥&nbsp;{{ item.orderAmount }}</text>
					</view>

					<view class="main8">
						<text lines="1" class="word7">病情描述：</text>
						<text lines="1" class="txt4 ">{{ item.content }}</text>
					</view>
					<view class="doctorIndex-order-btn">抢单</view>
				</view>
			</view>
		</view>
		<view v-if="qrcodeShow" class="qrcode-root">
			<view class="qrcode-dialog">
				<image class="close-btn"
					src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/ic_float_close.png"
					@click="showOrHideQRCode()"></image>
					<view class="poster-wrap">
						<l-painter ref="painter">
							<l-painter-view css="width: 568rpx; box-sizing:border-box; background: #ffffff; align-items: center; padding: 24rpx; border-radius: 24rpx;">
								<l-painter-image src="https://res.jiuzhang-cloud.com/jzy-oss/upload/image/dti-hospital/ikon@2x.png" css="width: 480rpx; height: 332rpx; margin: 24rpx auto; border-radius: 24rpx;"/>
								<l-painter-text css="font-size: 32rpx; color: #666666; margin: 24rpx 0" text="邀请您一起加入医生平台"></l-painter-text>
								<l-painter-view css="display:block; height: 2rpx; background: #E5E5E5; margin: 0;"></l-painter-view>
								<l-painter-view css="display:flex; align-items:center; margin: 24rpx;">
									<l-painter-image css="width: 88rpx; height: 88rpx; border-radius: 44rpx; margin-right: 16rpx" :src="userInfo.avatar"></l-painter-image>
									<l-painter-view css="flex:1; box-sizing:border-box;">
										<l-painter-text css="font-size: 32rpx; color: #222222; font-weight: 500; display:block;" :text="userInfo.username"></l-painter-text>
										<l-painter-text css="font-size: 24rpx; color: #999999;" text="长按识别二维码"></l-painter-text>
									</l-painter-view>
									<l-painter-qrcode :text="qrcodeContent" css="width: 120rpx;height: 120rpx;"></l-painter-qrcode>
								</l-painter-view>
							</l-painter-view>
						</l-painter>
					</view>
					<view class="btn-line">
						<button class="confirm-btn" open-type="share">微信分享</button>
						<view class="confirm-btn" @click="saveQRCode()">保存至相册</view>
					</view>
			</view>
		</view>
	</view>
</template>

<script>
import uTitle from '@/components/u-title/u-title.vue';
import { userInfo } from '@/utils/token.js';
export default {
	components: {
		uTitle
	},
	data() {
		return {
			userInfo: null,
			doctorInfo: null,
			hospital: null,
			orderCentterList: [],
			timeIndex: null,
			orderTotal: 0 ,//待问诊订单总数
			qrcodeContent: '',
			qrcodeShow: false
		};
	},
	created(option) {
		this.getDoctorInfo();
		this.orderCenter();
		this.doctorQuestionOrder();
		this.timeIndex = setInterval(() => {
			this.orderCenter();
		}, 5000);
		this.userInfo = userInfo.get();
	},
	onUnload() {
		clearInterval(this.timeIndex)
	},
	methods: {
		//获取医生/药师个人信息
		getDoctorInfo() {
			this.$api.getDoctorInfo({}).then(res => {
				if (res.code == 200) {
					this.doctorInfo = res.result;
					this.hospital = res.result.hosptail;
					this.qrcodeContent = 'https://disugroup.com/qrcode?scene=' + 'doctor_invite&id=' + this.doctorInfo.userId;
				}
			});
		},

		//问诊订单列表
		doctorQuestionOrder() {
			this.$api
				.doctorQuestionOrder({
					params: {
						orderType: 0,
						status: 0
					}
				})
				.then(res => {
					if (res.code == 200) {
						this.orderTotal = res.result.total;
					}
				});
		},

		//医生抢单中心
		orderCenter() {
			this.$api
				.orderCenter({
					params: {
						pageNo: 1,
						pageSize: 100
					}
				})
				.then(res => {
					if (res.code == 200) {
						this.orderCentterList = res.result.records;
					}
				});
		},
		
		showOrHideQRCode() {
			this.qrcodeShow = !this.qrcodeShow;
		},
		
		saveQRCode() {
			uni.showLoading({
				title: '保存中',
				mask: true
			});
			this.$refs.painter.canvasToTempFilePath({
			  fileType: "jpg",
			  // 如果返回的是base64是无法使用 saveImageToPhotosAlbum，需要设置 pathType为url
			  pathType: 'url',
			  quality: 1,
			  success: (res) => {
				uni.showToast({
					icon: 'success',
					title: '保存成功'
				});
				// 非H5 保存到相册
				// H5 提示用户长按图另存
				uni.saveImageToPhotosAlbum({
					filePath: res.tempFilePath,
					success: function () {
						console.log('save success');
					}
				});
			  },
			  complete: () => {
				  uni.hideLoading();
			  }
			});
		}
	}
};
</script>

<style lang="less">
@import './doctorIndex.less';
</style>
